<template>
  {{ isShowPreview }}
  <a-modal v-model:visible="isShowPreview" unmount-on-close title-align="start" :width="900">
    <template #title>
      <CustomTitle title="视频预览" />
    </template>
    <template #footer><div></div></template>
    <video
      v-if="isShowPreview"
      :src="previewVideoUrl"
      controls
      style="width: 100%; height: 50vh; object-fit: cover; cursor: pointer"
    ></video>
  </a-modal>
</template>

<script setup lang="ts">
import { computed } from "vue";

const props = defineProps({
  previewVideoUrl: {
    type: String,
    default: ""
  },
  modelValue: Boolean
});
const emit = defineEmits(["update:modelValue"]);
const isShowPreview = computed({
  get() {
    return props.modelValue;
  },
  set(val) {
    emit("update:modelValue", val);
  }
});
</script>

<style scoped lang="scss"></style>
